<?php slot('products') ?>
<div class="left">
	<h1 style="float:left;">Tooted</h1>
	<ul class="paging">
		<?php if($pages > 1 && $current > 1): ?><li><a href="?limit=<?php echo $sf_request->hasParameter('limit') ? $sf_request->getParameter('limit') : 0 ?>&page=<?php echo ($sf_request->getParameter('page') - 1) ?>">&lt;</a></li><?php endif ?>
      <?php for($i = 1; $i <= $pages; $i++): ?>
        <li<?php if($i == $current): ?> class="active"<?php endif ?>><a href="?limit=<?php echo $sf_request->hasParameter('limit') ? $sf_request->getParameter('limit') : 0 ?>&page=<?php echo $i ?>"><?php echo $i ?></a></li>
      <?php endfor ?>
        <?php if($pages > 1 && $current < $pages): ?><li><a href="?limit=<?php echo $sf_request->hasParameter('limit') ? $sf_request->getParameter('limit') : 0 ?>&page=<?php echo ($sf_request->getParameter('page') + 1) ?>">&gt;</a></li><?php endif ?>
	</ul>
	<div class="clear"></div>
	<div class="spacer"></div>

    <?php include_component('headerMenu', 'breadCrumbs') ?>
	
	<div class="breadcrumb" style="float:right;margin-right:5px;">
		<a href="?limit=0" class="active">N&auml;ita k&otilde;iki</a> >
 		<a href="?limit=48">48 lehel</a> >
 		<a href="?limit=24">24 lehel</a> 
	</div>
	<div class="clear"></div>

	
	<ul id="product-list">
	  <?php foreach($products as $product): ?>
        <li>
			<div class="overlay"><a href="/project_css_js/img/dummy/zoom.png"><img src="/project_css_js/img/products_overlay.png"  alt="Diivan" /></a></div>
			<a href="/project_css_js/img/dummy/zoom.png"><img src="<?php echo @myPicture::getInstance($product['brand_picture'])->thumbnail(170, 70, 'center')->url()?>"  alt="<?php echo $product['Translation'][$sf_user->getCulture()]['name'] ?>" /></a>
			<a href="<?php echo $links[$product['id']] ?>"><?php echo $product['Translation'][$sf_user->getCulture()]['name'] ?></a>
		</li>
      <?php endforeach ?>
	</ul>
	
</div>
<?php include_component('rightNestedMenu', 'render') ?>

<script type="text/javascript">

	$('#product-list LI').mouseover(function(){
		$('.overlay').css('display','none');
		$(this).find('.overlay').css('display','block');
	});
	$('.overlay').mouseleave(function(){
		$(this).css('display','none');
	});

</script>
<?php end_slot() ?>
